<!-- CellInteger.vue -->
<template>
  <input
      type="number"
      :value="modelValue"
      @input="handleInput"
      @focus="$emit('focus', $event)"
      @blur="$emit('blur', $event)"
      class="cell-input cell-integer"
      step="1"
  />
</template>

<script>
export default {
  name: 'CellInteger',
  props: {
    modelValue: {
      type: Number,
      default: 0
    }
  },
  emits: ['update:modelValue', 'focus', 'blur'],
  methods: {
    handleInput(event) {
      const value = parseInt(event.target.value, 10);
      this.$emit('update:modelValue', isNaN(value) ? 0 : value);
    }
  }
}
</script>
